{% extends "base.html" %}
{% load static %}
{% block title %}添加学生信息{% endblock %}
{% block css %}
    <link href="{% static 'css/layui.css' %}" rel="stylesheet">
{% endblock %}

{% block content %}
    <div class="layui-container">
        <blockquote class="layui-elem-quote">
            <h3>填写学生信息</h3>
        </blockquote>

        <div class="layui-row">

            <div  class="layui-col-md5" >
                <form action="/add_student/" method="post" enctype="multipart/form-data"/>
                    <hr class="layui-bg-green">

                    <select name="tGraid" id="tGraid" >
                        <option value="0">--选择班级--</option>
                        {%for grade in gradedata%}
                            <option value={{grade.grade_id}}>{{grade.name}}</option>
                        {% endfor %}
                    </select>
                    <hr class="layui-bg-green">

                    <input type="text" name="tId" id="tId" placeholder="学号" class="layui-input"/>
                    <hr class="layui-bg-green">

                    <input type="text" name="tName" id="tName" placeholder="姓名" class="layui-input"/>
                    <hr class="layui-bg-green">

                    <input type="text" name="tAge" id="tAge" placeholder="年龄" class="layui-input"/>
                    <hr class="layui-bg-green">

                    <select name="tSex" id="tSex" >
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select>
                    <hr class="layui-bg-green">

                    <input type="file" name="tImage" id="tImage" accept="image/*" onchange="imgChange(this)" />
                    <img id="img" src="/static/media/blank.jpg" width="120" height="100" />
                    <hr class="layui-bg-green">
                    <input type="submit" value="添加" class="layui-btn"/>
                </form>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    function imgChange(obj){
        var file = document.getElementById("tImage");
        var imgurl = window.URL.createObjectURL(file.files[0]);
        var img = document.getElementById("img");
        img.setAttribute('src',imgurl);
    };
</script>
{% endblock %}
